<template>
    <div class="page">
        <div class="search">
            <el-row style="padding-bottom:1%">
                <el-col :span="5" :offset="8">
                    <span>客户编号</span>
                    <el-input v-model="search.user_id" size="small" style="width: 60%"></el-input>
                </el-col>
                <el-col :span="5">
                    <span>航班编号</span>
                    <el-input v-model="search.flight_id" size="small" style="width: 60%"></el-input>
                </el-col>
                <el-col :span="3">
                    <el-button type="primary" @click="searchOrderList(1)">搜 索</el-button>
                </el-col>
                <el-col :span="3">
                    <el-button type="primary" plain @click="getOrderList(1)">查看全部</el-button>
                </el-col>
            </el-row>
            <el-row class="btn-group">
                <el-col :span="3" :offset="18">
                    <el-button type="primary" @click="editOrder({},false)">新建订单</el-button>
                </el-col>
                <el-col :span="3">
                    <el-button type="warning" v-print="'#printContent'">打印表格</el-button>
                </el-col>
            </el-row>
        </div>
        <el-table :data="orderList" border id="printContent">
            <el-table-column prop="order_id" label="订单编号" width="100"></el-table-column>
            <el-table-column prop="user_id" label="客户编号"></el-table-column>
            <el-table-column prop="flight_id" label="航班编号"></el-table-column>
            <el-table-column prop="touristClassNum" label="经济舱数量"></el-table-column>
            <el-table-column prop="businessClassNum" label="商务舱数量" ></el-table-column>
            <el-table-column prop="firstClassNum" label="头等舱数量"></el-table-column>
            <el-table-column prop="totalPrice" label="总价"></el-table-column>
            <el-table-column prop="remark" label="备注"></el-table-column>
            <el-table-column prop="option" label="状态">
                <template slot-scope="scope">
                    <el-tag type="danger" v-if="getState(scope.row)">已取消</el-tag>
                    <el-button size="small" type="danger" @click="deleteOrder(scope.row)" v-else>删除</el-button>
                </template>
            </el-table-column>
        </el-table>
        <div class="block">
            <el-pagination :current-page.sync="currentPage" :page-size="10" :total="count"
                layout="prev, pager, next, jumper" @current-change="handleCurrentChange">
            </el-pagination>
        </div>
        <el-dialog title="编辑数据" :visible.sync="dialogVisible">
            <orderEditor :form ="order" :disable="isEdit"
                @closeDialog="dialogVisible=false"  @refresh="refresh"></orderEditor>
        </el-dialog>
        
    </div>
</template>
<script>
import orderEditor from "./base/order-editor"
export default {
    name:"order",
    components:{
        orderEditor
    },
    data(){
        return{
            orderList:[],
            order:{},
            isEdit:false,
            dialogVisible:false,
            currentPage:1,
            count:0,
            isSearch:false,
            search:{
                user_id:'',
                flight_id:''
            }
        }
    },
    methods:{
        getOrderList(page){
            this.isSearch = false
            this.currentPage = page
            this.clearObj(this.search)
            this.getMethod(`/api/order/getOrderList?page=${page}`,"get",{},(data)=>{
                this.orderList = data.list;
                this.count = data.count;
            })
        },
        searchOrderList(page){
            let search = this.search
            if(this.checkEmpty(search.user_id)&&this.checkEmpty(search.flight_id)){
                this.showMessage('搜索条件不能全为空','error')
                return;
            }
            this.isSearch = true
            this.currentPage = page
            this.getMethod(`/api/order/searchOrderList?page=${page}${this.checkObject(search)}`,"get",{},(data)=>{
                this.orderList = data.list;
                this.count = data.count;
            })
        },
        handleCurrentChange(current){
            if(this.isSearch){
                this.searchOrderList(current)
            }else{
                this.getOrderList(current)
            }
        },
        editOrder(order,isEdit){
            this.order = order;
            this.isEdit = isEdit;
            this.dialogVisible = true;
        },
        deleteOrder(item){
            this.showConfirm('是否确认删除该订单?','提示','warning',()=>{
                this.$http.post("/api/order/deleteOrder",{
                    order_id:item.order_id,
                    flight_id:item.flight_id,
                    touristClassNum:item.touristClassNum,
                    businessClassNum:item.businessClassNum,
                    firstClassNum:item.firstClassNum,
                    admin_id:this.$cookies.get("admin").admin_id
                }).then((res)=>{
                    if(this.checkCode(res.status)){
                        this.showMessage('删除成功!', 'success');
                        this.$http.post("/api/ticket/delTicket",{
                            order_id:item.order_id
                        }).then((res)=>{
                            console.log("delTicket",res);
                        })
                    }else{
                        this.showMessage('操作失败','error');
                    }
                })
            })
        },
        getState(item){
            return item.is_del == 1
        },
        refresh(){
            this.handleCurrentChange(this.currentPage);
        }
    },
    mounted(){
        this.getOrderList(1);
    }
}
</script>